<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
    <style type="text/css">
      #d_tag2 { position:absolute; z-index:1111; float:left; left:4px; top:2px;  
	          font-size:12px;
              font-family:Verdana, "Lucida Grande", Arial, Helvetica, sans-serif; } 
	  #d_tag2 span { cursor:default; display:inline-block; border:solid 1px #ccc; background-color:#ffffcc; border-radius:5px; padding:2px 4px; margin-right:4px;}
	  
	  .uploadifyDiv{
	  	position: relative;  
	  }
	  
	  .uploadifyDesc{
		position:absolute; 
		left:100px; 
		top:-2px; 
		height:30px; 
		line-height:30px; 
		width:570px; 
		background-color: #f5faff; 
		padding-left: 10px;
		}  
    </style>
    
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/seriesComboBoxs/jquery.seriesComboBoxs.js" charset="utf-8"></script>
    <link href="${pageContext.request.contextPath}/js/uploadify/uploadify.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/uploadify/jquery.uploadify.js"></script>
     
<script type="text/javascript">
	$(function(){
	 	$(".listtable").zebra(); 

		//新增按纽绑定事件
		$('#problemLevel_add').combobox({
			url:'${pageContext.request.contextPath}/problemmgr/problemAction!getDic.action?codeType=warnLevel',  
   			valueField:'codeValue',  
  	 		textField:'codeName',
  	 		required: true,
  	 		editable:false,
  	 		panelHeight:'auto',
  	 		onLoadSuccess:function(){
  				//不让第一条为默认选择项
  				$('#problemLevel_add').combobox('unselect',0);
  			}
		});
		
		
		
		//加载处理人数据
	$('#handler_add').combogrid({  
        panelWidth:450,  
        idField:'userid', //ID字段  
        textField:'username', //显示的字段  
        url:"${pageContext.request.contextPath}/problemmgr/problemAction!showHandler.action",  
        fitColumns: true,  
        striped: true,
        editable:false,
        pagination : true,//是否分页  
        rownumbers:true,//序号  
        collapsible:false,//是否可折叠的  
        fit: true,//自动大小  
        pageSize: 10,//每页显示的记录条数，默认为10  
        pageList:[10,20,30],//可以设置每页记录条数的列表  
        method:'post',  
        columns:[[{field:'userid',title:'用户ID',width:70,align:'center',sortable:true},				  
				  {field:'username',title:'用户名称',width:75,align:'center',sortable:true}		 
				]],
		toolbar:'#tb'
    });
	});
	$(document).ready(function(){
		 //显示附件列表
		   showFileList();
	       $('#file_upload_add').uploadify({ 
	    	    //开启调试
	            'debug' : true,
			    'formData':{
			    	"bussId" : '${problemId}start', 
	   				"bussType":"0"		
			  	 },  
				'cancelImg': '${pageContext.request.contextPath}/js/uploadify/uploadify-cancel.png', 
				'swf'    : '${pageContext.request.contextPath}/js/uploadify/uploadify.swf',
				'uploader' : '${pageContext.request.contextPath}/upload/fileAction!multipleUpload.action',
				'multi':'true', 
				'buttonText':'', 
				'width': 88, 
			    'height': 26,       
				'removeTimeout' : 2,           //默认进度条延迟消失时间 单位秒
				'queueID':'uploadfileQueue_add',
				'fileSizeLimit' : '60MB', 
				'fileTypeExts':'*.txt;*.rar;*.zip;*.doc;*.docx;*.xls;*.xlsx;*.jpg;*.jpeg;*.gif;*.png',
				 'queueSizeLimit' : 10, 
				 'overrideEvents':['onSelectError'],  
				'onQueueComplete':function(queueData){
					//刷新附件列表 
					$("#divDatagrid_add").css("display","block"); 
					showFileList();
				},
				 //返回一个错误，选择文件的时候触发
		        'onSelectError':function(file, errorCode, errorMsg){
		            switch(errorCode) {
		                case -100:
		                    alert("上传的文件数量已经超出系统限制的"+$('#file_upload_add').uploadify('settings','queueSizeLimit')+"个文件！");
		                    break;
		                case -110:
		                    alert("文件 ["+file.name+"] 大小超出系统限制的"+$('#file_upload_add').uploadify('settings','fileSizeLimit')+"大小！");
		                    break;
		                case -120:
		                    alert("文件 ["+file.name+"] 大小异常！");
		                    break;
		                case -130:
		                    alert("文件 ["+file.name+"] 类型不正确！");
		                    break;
		            }
		            return;
		        },
		        //检测FLASH失败调用
		        'onFallback':function(){
		            alert("您未安装FLASH控件，无法上传图片！请安装FLASH控件后再试。");
		        },
		        //上传到服务器，服务器返回相应信息到data里
		        'onUploadSuccess':function(file, data, response){
		            //alert(data);
		        },
		        //某个文件开始上传的时候触发
		        'onUploadStart' : function(file) {
		        	$("#divNoneData_add").css("display","none"); 
		        }
			}); 
		 
		//增加隔行变色效果
  	     $(".listtable").zebra();
		 
	 });	
			
		
	

	//显示附件列表
    function showFileList() {
   		//刷新页面  problemmgr
   		$('#table_datagrid_add').datagrid({
   			url:'${pageContext.request.contextPath}/upload/fileAction!toListUploadFiles.action',
   			queryParams:{
   				"bussId" : '${problemId}start',
   				"bussType":"0"	
   			},
   			fit:true,
   			border:false,
   			fitColumns:true,
   			pagination:false,
   			pageList:[10,20,30],
   			rownumbers:false,
   			singleSelect:true,                   
   			autoRowHeight:true,
   			sortName:'uploadTime',
   			sortOrder:'asc', 
   			onLoadSuccess:function(data){
   				if(data.rows.length==0){                              //判断是否有值 没值隐藏该datagrid 并显示提上上传的图片
   					$("#divDatagrid_add").css("display","none"); 
   					$("#divNoneData_add").css("display","block");
   				}else{
   					$("#divNoneData_add").css("display","none"); 
   				}
   			},
   			columns:[[{
   				field:'fileName',
   				title:'附件名称',
   				width:200 
   			},{
   				field:'uploadUserName',
   				title:'上传人',
   				width:60
   			 },{
   				field:'fileSize',
   				title:'附件大小',
   				width:60
   			 },{
   				field:'uploadTime',
   				title:'上传时间',
   				width:150 
   			},{
   				field:'fileId',
   				title:'操作',
   				width:150,
   				align:'center', formatter: function (fileId,rowData,rowIndex){  
						return '<span  style="cursor:pointer" onclick="downLoadFile(\''+fileId+'\')" )"><img onclick="downLoadFile(\''+fileId+'\')" src="${pageContext.request.contextPath}/images/icons/downFile.png" title="下载" alt="下载"/>下载</span>'
   						    + '<span  style="cursor:pointer" onclick="doDeleteFile(\''+fileId+'\')"><img onclick="doDeleteFile(\''+fileId+'\')" src="${pageContext.request.contextPath}/images/icons/delete.png" title="删除" alt="删除"/>删除</span>'; 
   				}
   			}]],
   		});  
   	}
	  
	  
	  
  //附件下载
	function downLoadFile(fileId){
		$("#fileDownFrame_add").attr("src","${pageContext.request.contextPath}/upload/fileAction!toDownLoadFile.action?fileId="+fileId);
	}
    
     //删除附件
   	function doDeleteFile(fileId){
        var pars="fileId="+fileId;
   		$.messager.confirm('删除确认', '确定要删除该条记录吗？',function(r){
   			if(r){ 
	   			$.ajax({
	   				 url :'${pageContext.request.contextPath}/upload/fileAction!toDeleteFile.action',
	   				 data:pars,
	   				 dataType :'json',
	   				 success : function(data){
	   					 if(data=='success'){
	   						//重新刷新表格
	   						 showFileList();
	   					 }else{
	   						 alert('error');
	   					 }
	   				 }
	   	   }); 
   			}
   		});
   	}
	
	
	//弹出页面
	function showHandler(){		
		$('<div id="handlerClose"/>').dialog({
			href:'${pageContext.request.contextPath}/problemmgr/problemAction!toHandlerPage.action',
			top:($(window).height()-150)*0.5,
		    left:($(window).width()-300)*0.5,
			width:400,
			height:220,
			modal:true,
			title:'选择处理人',			
			onClose:function(){
				$(this).dialog('destroy');
			}
		});
	}
	
	function queryUser()
	{
		var username=$('#query_userName').val();	
		var query={username:username}; //把查询条件拼接成JSON
		var grid=$("#handler_add").combogrid('grid');
		$(grid).datagrid('options').queryParams=query; //把查询条件赋值给datagrid内部变量
		$(grid).datagrid('load');
	}
	
	function resetQuery()
  	{
		$('#query_userName').val('');
   	}
</script>
<div class="easyui-tabs" style="width:auto;height:300px">
	<div title="处理问题" style="padding:0px">
		<form id="problem_main_form" method="post">
		 	<table border="0" cellpadding="0" cellspacing="0" height="100%"  width="100%" class="listtable">
			    <tr>
			      <td height="40px" align="right"><span style="color:red;font-size:15px">*</span>问题主题：&nbsp;</td>
			      <td height="40px" align="left"><input type="text" id="title_add" name="title" class="easyui-validatebox" data-options="required:true,missingMessage:'问题主题必须填写'" validType="specialCharFilter('title_add')" style="width:150px;"/></td>
			      <td height="40px" align="right">关键字：&nbsp;</td>
			      <td height="40px" align="left"><input id="keyword_add" type="text" name="keyWord" class="easyui-validatebox" validType="specialCharFilter('keyword_add')" style="width:150px;"/></td>
			     </tr>
			     
			     <tr>
			      <td height="40px" align="right"><span style="color:red;font-size:15px">*</span>问题级别：&nbsp;</td>
			      <td height="40px" align="left">
			      	 <input id="problemLevel_add" class="easyui-combobox"  name="problemLevel" style="width:153px;"/>
			      </td> 
			      <td height="40px" align="right"><span style="color:red;font-size:15px">*</span>处理人：&nbsp;</td>
			      <td height="40px" align="left">
			      	 <input id="handler_add" data-options="required:true,missingMessage:'处理人必须填写'"   name="handler" style="width:153px;height: 21px"/>
			      </td>
			     </tr>
			     
			     
			     <tr>
			     	<td height="40px" align="right"><span style="color:red;font-size:15px">*</span>问题描述：&nbsp;</td>
			        <td colspan="3" height="40px" align="left">
			      	  <textarea id="problemDesc_add"   name="problemDesc" class="easyui-validatebox" data-options="required:true,missingMessage:'解决方案必须填写',validType:'length[0,1000]'" style="width:90%;height:100px;resize:none;"></textarea>
			        </td>
			     </tr>
			     <input type="hidden" name="problemId" value="${problemId}"/>
			     <!-- <tr>
			      <td height="40px">备注:&nbsp;</td>
			      <td colspan="3" height="40px">
			      	<textarea id="remark" name="remark_add" style="width:90%;height:60px;resize:none"></textarea>
			      </td>
			     </tr>  -->
		    </table>
	 	</form>
	</div>
	<div title="附件上传" style="padding:10px;">
	        <br/>
			<form class="uploadifyDiv">
				<input id="file_upload_add" name="Filedata"  type="file">  
				<div class="uploadifyDesc">你可以同时上传10个附件;格式为txt,rar,zip,doc,docx,xls,xlsx,jpg,jpeg,gif,png;每个附件不大于60M!</div>
				<!-- 用于显示进度条 -->
				<div id="uploadfileQueue_add"></div>    
			</form> 
		  <br/>
		  <div data-options="region:'center'" style="height:150px;width:100%;" id="divDatagrid_add">     
	          <table id="table_datagrid_add" style="height:auto" > 
			 </table> 
	      </div>  
	      <div id="divNoneData_add" style="width:300px; height:100px;text-align:center; padding-top:50px;margin:0px auto;"><img src="${pageContext.request.contextPath}/js/uploadify/fjnone.png"/></div>
		<iframe id="fileDownFrame_add" src="" style="display:none; visibility:hidden;"></iframe> 
	</div>
   </div>
<div id="tb" style="padding:5px;height:auto">   
    <div>  
               用户名称 : <input id="query_userName" type="text" class="easyui-validatebox" style="width:150px" >  
        <input type="button" id="btnQuery" onclick="queryUser()" value="查 询" style="cursor:pointer;background-image: url('${pageContext.request.contextPath}/images/login/search.png');background-repeat: no-repeat;width:67px;height:23px;padding-left:12px;border:none;color:white;font-family:微软雅黑;"/>	
		<input type="button" id="btnReset" onclick="resetQuery()" value="重 置" style="cursor:pointer;background-image: url('${pageContext.request.contextPath}/images/login/reset.png');background-repeat: no-repeat;width:67px;height:23px;padding-left:12px;border:none;color:white;font-family:微软雅黑;margin-right:55px"/> 
    </div>  
</div>